TechNote - Colors

Sunday, February 19, 2023

12:53 PM

I'm baffled! I have no idea how OneNote maps colors when you see either a light background or a dark background using the Switch Background button on the View ribbon.

 

At a first glance, it seems that if the page background is dark (brightness is less than 50%) then OneNote increases the brightness of all applied colors by 25%; the L of the HSL color value is increased by 25, but not always.

 

In another case of Microsoft being "too smart for their own good", OneNote doesn't allow you to override those colors from the COM API. No matter what colors you apply to the XML, OneNote will increase the brightness if the page background is considering "dark". You can, however, still use OneNote's font color button and it will happily apply any color your choose.

 

?

Question

Is there a relationship, a single equation that translates between these palettes? Or is it just a hardcoded mapping? And how about colors that are not explicitly on the color pickers? How does OneNote convert those custom values between dark and light?

 

 

Registry for Office Themes

OneNote follows the Microsoft Office theme. All Office apps are controlled by a single Registry key

 

Computer\HKEY_CURRENT_USER\Software\Microsoft\Office\16.0\Common

 

The key has one of two properties based on Office version (I believe). They are Theme or UI Theme. Valid values for this property are

 

Colorful

0

Dark Gray

3

Black

4

White

5

 

Light mode vs. Dark mode

If we explore the differences between the light mode color picker and the dark mode color picker

 

Machine generated alternative text: Automatic Theme Colors Standard Colors Recent Colors More Colors...

Machine generated alternative text: Heal Automatic Theme Colors Standard Colors Recent Colors More Colors...

 

It doesn't appear to be a straight inversion of colors. You can see the pictures below are not the same as those above.

 

Machine generated alternative text: Automatic Theme Colors Standard Colors Recent Colors More Colors...

Machine generated alternative text: Heal Automatic Theme Colors Standard Colors Recent Colors More Colors...

 

 

Interrogate each color and list its RGB and HSL values

 

#FFFFFF
0,0,100
White

#000000
0,0,0
Black

#e7e6e6
0,2,90

Light Gray

#44546a

215,22,34
Blue Gray

#5b9bd5

209,59,60
Blue

#ed7d31

24,84,56
Orange

#e84c22

13,81,52
Red

#ffc000

45,100,50
Gold

#8064a2

267,25,51
Purple

#70ad47

96,42,48
Green

 

 

 

 

 

 

 

 

 

 

#F2F2F2
0,0,95
White

#7F7F7F
0,0,50
Gray

#D0CECE
0,2,81
Light gray

#D6DCE4
214,21,87
Ice blue

#DEEBF6
208,57,92
Light blue

#FBE5D5
25,83,91
Light orange

#FADBD2
14,80,90
Rose

#FFF2CC
45,100,90
Light yellow

#E5E0EC
265,24,90
Lavender

#E2EFD9
95,41,89
Light green

#D8D8D8
0,0,85
Light gray

#595959
0,0,35
Dark gray

#AEABAB
0,2,68
Light gray

#ADB9CA
215,21,74
Ice blue

#BDD7EE
208,59,84
Light blue

#F7CBAC
25,82,82
Light orange

#F5B7A6
13,80,81
Rose

#FEE599
45,98,80
Light yellow

#CCC1D9
268,24,80
Lavender

#C5E0B3
96,42,79
Light green

#BFBFBF
0,0,75
Light gray

#3F3F3F
0,0,25
Dark gray

#757070
0,2,45
Gray

#8496B0
215,22,60
Blue gray

#9CC3E5
208,58,75
Light blue

#F4B183
24,84,74
Lt orange

#F1937A
13,81,71
Rose

#FFD965
45,100,70
Light yellow

#B2A1C7
267,25,71
Lavender

#A8D08D
96,42,68
Light green

#A5A5A5
0,0,65
Gray

#262626
0,0,15
Dark gray

#3A3838
0,2,22
Dark gray

#323F4F
213,22,25
Blue gray

#2E75B5
208,59,45
Blue

#C55A11
24,84,42
Brown

#B43512
13,82,39
Dark red

#BF9000
45,100,37
Dark yellow

#5F497A
267,25,38
Dark purple

#538135
96,42,36
Dark green

#7F7F7F
0,0,50
Gray

#0C0C0C
0,0,5
Black

#171616
0,2,9
Dark gray

#222A35
215,22,17
Blue gray

#1E4E79
208,60,30
Dark blue

#833C0B
24,85,28
Brown

#78230C
13,82,26
Dark red

#7F6000
45,100,25
Dark yellow

#3F3151
266,25,25
Dark purple

#375623
96,42,24
Dark green

 

 

 

 

 

 

 

 

 

 

#C00000
0,100,38
Dark red

#FA0000
0,100,49
Red

#FFC001
45,100,50
Gold

#FFFF00
60,100,50
Yellow

#92D050
89,58,56
Lime

#00B050
147,100,35
Dark green

#00B0F0
196,100,47
Turquoise

#0070C0
205,100,38
Dark blue

#002060
220,100,19
Dark blue

#7030A0
274,54,41
Purple

 

 

 

 

 

 

 

 

 

 

#201f1e
30,3,12
Dark Gray

#edebe9
30,10,92
Tan

#1c1c1c

0,0,11
Dark Gray

#bbc7d3

210,21,78
Ice Blue

#327dc3

209,59,48
Blue

#c15710

24,85,41
Brown

#ea5f39

13,81,57
Red

#664e00

46,100,20
Dark Yellow

#ab99c2

266,25,68
Lavender

#517f34

97,42,35
Dark Green

 

 

 

 

 

 

 

 

 

 

#0D0D0D
0,0,
Black

#8F8F8F
0,0,56
Gray

#544F4F
0,3,32
Dark gray

#3C465D
222,22,30
Blue gray

#1A4665
205,59,25
Dark blue

#69310C
24,79,23
Brown

#7F2A10
14,78,28
Dark red

#4D3B00
46,100,15
Dark yellow

#4E3C62
268,24,31
Dark purple

#27441D
105,40,19
Dark green

#4D4D4D
0,0,30
Dark gray

#B3B0AD
30,4,69
Light gray

#6C6565
0,3,41
Gray

#545783
236,22,42
Indigo

#1D5072
204,59,28
Dark blue

#7B3909
25,86,26
Brown

#9A3013
13,78,34
Dark red

#564201
46,98,17
Dark yellow

#614F7D
263,23,40
Purple

#33521E
96,46,22
Dark green

#414140
60,1,25
Dark gray

#E8E8E8
0,0,91
Light gray

#7C7676
0,2,47
Gray

#677D9E
216,22,51
Blue gray

#275F90
208,57,36
Dark blue

#90440E
25,82,31
Brown

#BA3712
13,82,40
Red

#5C4500
45,100,18
Dark yellow

#7C5D98
272,24,48
Purple

#405E26
92,42,26
Dark green

#5A5A5A
0,0,35
Dark gray

#D9D9D9
0,0,85
Light gray

#F2F2F2
0,0,95
White

#E6EBEF
207,22,92
Ice blue

#69A4D8
208,59,63
Blue

#EC7627
24,84,54
Orange

#F39A81
13,83,73
Rose

#997300
45,100,30
Dark yellow

#CFC3DA
271,24,81
Lavender

#6CAA46
97,42,47
Green

#8F8F8F
0,0,56
Gray

#F3F3F3
0,0,95
White

#FFFFFF
0,0,100
White

#F7F9FB
210,33,98
White

#B2D0EB|208,59,81
Light blue

#F9C59F
25,88,80
Lt orange

#FCDED9
9,85,92
Rose

#DBA400
45,100,43
Gold

#F6F2F8
280,30,96
White

#B6D9A1
98,42,74
Light green

 

 

 

 

 

 

 

 

 

 

#FF6363
0,100,69
Rose

#FF0505
0,100,51
Red

#893A06
24,92,28
Brown

#8A6700
45,100,27
Dark yellow

#466D1D
89,58,27
Dark green

#00853C
147,100,26
Dark green

#018687
180,99,27
Dark teal

#3DAEFF
205,100,62
Blue

#76CAFF
203,100,7
Light blue

#A76ED4
274,54,63
Lavender

 

 

 

 

 

 

 

 

 

 

 

Custom Page Colors

 

 

 

 

View this table in light mode!

Blue
#ECF3FA

Teal
#EEF8F6

Green
#F1F9F3

Red
#FCEEEE

Blue Mist
#EEF1F9

Cyan
#F0F8FA

Apple
#F2F9ED

Red Chalk
#FDF5F5

Purple Mist
#F2F1F9

Silver
#F5F7F9

Lemon Lime
#F5F9EB

Tan
#F6EDE6

Purple
#F9F1F8

Magenta
#FDEFF7

Yellow
#FEF8E6

Orange
#FCF3EA

Blue
#081321

Teal
#04100F

Green
#0C1C14

Red
#310808

Blue Mist
#101628

Cyan
#060E0E

Apple
#0E1708

Red Chalk
#2D0B0B

Purple Mist
#14142A

Silver
#0E0E16

Lemon Lime
#121306

Tan
#231710

Purple
#1D0C1A

Magenta
#28061C

Yellow
#161104

Orange
#1F1205

 

 

View this table in dark mode!

Blue
#ECF3FA

Teal
#EEF8F6

Green
#F1F9F3

Red
#FCEEEE

0,70,96

Blue Mist
#EEF1F9

Cyan
#F0F8FA

Apple
#F2F9ED

Red Chalk
#FDF5F5

Purple Mist
#F2F1F9

Silver
#F5F7F9

Lemon Lime
#F5F9EB

Tan
#F6EDE6

Purple
#F9F1F8

Magenta
#FDEFF7

Yellow
#FEF8E6

Orange#
1F1205

Blue
#DEE9F7

Teal
#EFFBFA

Green
#E3F3EB

Red
#797775

Blue Mist
#D7DDEF

Cyan
#F1F9F9

Apple
#EEF7E8

Red Chalk
#F4D2D2

Purple Mist
#D5D5EB

Silver
#E9E9F1

Lemon Lime
#F8F9EC

Tan
#EFE3DC

Purple
#F3E2F0

Magenta
#F9D7ED

Yellow
#FBF6E9

Orange
#F9E8D7

 

 

References

 

 

#omwiki #omdeveloper #omtechnote

 

© 2020 Steven M Cohn. All rights reserved.

Please consider a sponsorship or one-time donation to support ongoing development

 

Created with OneNote.